<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
	<meta charset="UTF-8">
	<meta name="renderer" content="webkit">
	<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
	<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">	
	<meta name="apple-mobile-web-app-status-bar-style" content="black">	
	<meta name="apple-mobile-web-app-capable" content="yes">
	<meta name="format-detection" content="telephone=no">
	<title>首页</title>
	<link rel="icon" href="assets/images/favicon.ico" type="image/x-icon"/>
	<link rel="stylesheet" href="assets/css/main.css" />
	<link rel="stylesheet" href="assets/libs/iconfont/iconfont.css" />
	<script src="assets/libs/jquery/1.8.1/jquery.min.js"></script>
	<script src="assets/libs/layer/layer.js"></script>
	<script src="assets/js/main.js"></script>
	<style>
	.main{padding:16px;width:998px;margin: 0 auto;border-color:#cce0ff;position:relative;height:400px;}
	.login-left{width:510px;position:absolute;left:0;}
	.login-left img{display:block;margin:20px auto;}
	.hol-line{position:absolute;width:2px;height:320px;left:510px;top:60px;background:#e6e6e6;}
	.form{width:300px;position:absolute;right:100px;top:65px;}
	.form input[type=text],.form input[type=password]{margin-bottom: 20px;padding-left:16px;display:block;width:100%;height;38px;line-height:38px;font-size:14px;}
	.form input{outline: none; -webkit-transition: border-color .3s cubic-bezier(.65,.05,.35,.5); transition: border-color .3s cubic-bezier(.65,.05,.35,.5); -webkit-box-sizing: border-box !important; -moz-box-sizing: border-box !important; box-sizing: border-box !important;}
	.login-title{height:126px;font-size:72px;text-align:center;}
	.login-title img{display:block;margin:0 auto;}
	.form input[type=checkbox]{display:inline-block;}
	a{text-decoration: none;color:grey;}
	</style>
</head>
<body>
  	
  	<div class="header">
  		<div class="container">
  			<a class="header-logo" href="/"><img src="assets/images/logo.png" /></a>
  		</div>
  	</div>
  	
  	<div class="container">
  	
  		<div class="login-title">
  			<div style="height:46px;"></div>
			<div style="text-align:center;font-size:32px;color:#333;">欢迎登录环保大湾区管理系统</div>
  		</div>
		<div class="main">
			<div class="login-left">
				<img src="assets/images/login-left.png" >
				<div style="text-align:center;color:#c1c1c2;margin-top:50px;"></div>
			</div>
			<div class="hol-line"></div>
  			<form method="POST" class="form">
  				<div style="height:22px;"></div>
  				<input type="hidden" name="reqId" th:value="${reqId}" />
  				<input type="text" name="username" data-verify="required" placeholder="用户名" />
  				<input type="password" name="password" data-verify="required" placeholder="密码" />
  				<img th:if="${needValidate}" id="validateCode" th:src="@{loginValidateCode/{reqId}(reqId=${reqId},ts=${ts})}" style="display:block;width:110px;height:38px;float:right;" />
  				<input th:if="${needValidate}" type="text" id="imgVc" name="loginValidateCode" placeholder="图形验证码" style="width:180px;" />
  				<input style="display:block;width:100%;background:#3381ff;color:white;margin:20px 0;padding:0;" type="submit" value="登录" />
  				<!-- <div style="text-align:center;"><a style="color:#999999;" href="password/index">忘记密码</a>&emsp;&emsp;<a style="color:#999999;" href="register">立即注册</a></div> -->
  			</form>
  		</div>
  		
  		<div style="height:30px;"></div>
  		<div style="text-align:center;color:#999999;"></div>
  		<div style="height:60px;"></div>
	</div>
	
	<script>
	var validateCodeDom=document.getElementById("validateCode");
	if(validateCodeDom){
		validateCodeDom.onclick=function(){
			var srcSplit=this.src.split("?");
			var now=new Date().getTime();
			this.src=srcSplit[0]+"?ts="+now;
		}
	}
	onload=function(){
		var denied=[[${denied}]];
		if(denied)return alert("客户端操作过于频繁，已锁定");
		var error='[[${session[SPRING_SECURITY_LAST_EXCEPTION]?.message}]]';
		switch(error){
		case 'User account is locked':
			alert('帐号已被锁定');
			break;
		case 'Bad credentials':
			alert('密码或验证码错误');
			break;
		default:
			break;
		}
	}
	</script>
	
</body>
</html>